<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>class230222聊天室</title>
    <link rel="stylesheet" href="./css/index.css" />
  </head>
  <body>
    <div id="app">
      <div class="username-wrap save-user">
        <input type="text" placeholder="请输入用户名" class="username-input" />
        <button class="submit-btn">确定</button>
      </div>
      <div class="username-wrap update-user">
        <span>用户名: <span class="username"></span></span>
        <button class="submit-btn update-btn">修改</button>
      </div>
      <div class="room-container">
        <div class="room-header">
          <h1>class230222聊天室</h1>
        </div>
        <div class="room-body">
          <!-- <div class="message-item">
            <p class="message-header">张三 14:00:00</p>
            <span class="message-content">你好</span>
          </div>

          <div class="message-item my">
            <p class="message-header">我 14:00:00</p>
            <div class="message-content-wrap">
              <span class="message-content">
                豫章故郡，洪都新府。星分翼轸，地接衡庐。襟三江而带五湖，控蛮荆而引瓯越。物华天宝，龙光射牛斗之墟；人杰地灵，徐孺下陈蕃之榻。雄州雾列，俊采星驰。台隍枕夷夏之交，宾主尽东南之美。都督阎公之雅望，棨戟遥临；宇文新州之懿范，襜帷暂驻。十旬休假，胜友如云；千里逢迎，高朋满座。腾蛟起凤，孟学士之词宗；紫电青霜，王将军之武库。家君作宰，路出名区；童子何知，躬逢胜饯
              </span>
            </div>
          </div> -->
        </div>
        <div class="room-footer">
          <textarea class="text" placeholder="请输入文字"></textarea>
          <button class="btn" disabled>发送</button>
        </div>
      </div>
    </div>
    <div class="emoji-list">
    </div>
    <script src="./js/index.js"></script>
  </body>
</html>
